<script setup lang="ts">
import { ref, onMounted } from 'vue'

const el = ref<HTMLInputElement | null>(null)

onMounted(() => {
  // 对于可能有, 也可能为空的内容, 类型安全控制有三种办法
  // 1. 可选链
  el.value?.focus()
  // 2. 逻辑判断(又叫类型守卫)
  if (el.value) {
    el.value.focus()
  }
  // 3. 非空断言(断言前面的数据一定存在)
  el.value!.focus()
})
</script>

<template>
  <input ref="el" />
</template>